<template>
  <component :is="type" @click="linkProps(route)">
    <slot />
  </component>
</template>

<script>
import { isExternal } from '@/utils/validate'

export default {
  props: {
    to: {
      type: String,
      required: true
    },
    route: {
      type: Object,
      required: true,
      default() {
        return {}
      }
    }
  },
  computed: {
    isExternal() {
      return isExternal(this.to)
    },
    type() {
      // if (this.isExternal) {
      return 'a'
      // }
      // return 'router-link'
    }
  },
  methods: {
    linkProps(route) {
      if (route.name === 'main') {
        this.$EventBus.$emit('addTabItem', route)
      } else {
        this.$EventBus.$emit('addTabItem', route)
      }
      // if (this.isExternal) {
      //   return {
      //     href: to,
      //     target: '_blank',
      //     rel: 'noopener'
      //   }
      // }
      // return {
      //   to: to
      // }
    }
  }
}
</script>
